description = "header"
==
use Jason\Ccshop\Components\Catalog;
function onStart()
{ 
  //顶部通条的获取迁移到此处
  $bannerHeader = (new Catalog)->fetchAd('pc-top-banner');
  $this['bannerHeader'] = $bannerHeader;
  if($bannerHeader){
    $this['nowDate'] = date('Y-m-d H:i:s');
  }
  //dd($bannerHeader);
}
==
{% set shoppingCart = catalog.getShoppingCart %}
<header class="header por"  id="divBox">
	<div class="container">
		<div class="headTop row">
			<div class="col-lg-8">
				<div class="topNav_left"><a href="/"><img src="{{ 'assets/img/logo.png'|theme }}" alt=""></a></div>
			</div>
			<div class="col-lg-4">
				<div class="txt-r">
					<i class="fa fa-user"></i>
					{% if user.id %}
					<a href="javascript:;" data-request="onLogout" data-request-data="redirect: '/'">ログアウト</a>
					/
					<a href="/account/dashboard.html"><b>{% if user.id %}{{ user.surname }} 様{% endif %}</b></a>
					{% else %}
					<a href="/account/login.html">ログイン</a>
					/
					<a href="/account/register.html">登録</a>
					{% endif %}
					
				</div>
			</div>
		</div>
		<div class="topNav_right row">
			<div class="col-lg-12">
				<div class="headBottom">
					<ul class="muneNav flexBox">
						<li dataShow="new"><a href="/daily-new.html?rel=home">新入荷</a></li>
						<li dataShow="item"><a href="/sale.html?rel=home">売れ筋商品</a></li>
						{% set categories = catalog.categories() %}
						{% for rootcategory in categories %}
						{% for key, category in rootcategory.children %}
						{% if category.is_enabled %}
						<li dataShow="item{{key}}"><a href="{{ category.url }}">{{ category.name }}</a></li>
						{% endif %}
						{% endfor %}
						{% endfor %}
						<li dataShow="search"><a href=""><i class="fa fa-search" aria-hidden="true"></i>&nbsp;検索</a></li>
						<li class="navMybag">
							<a href="javascript:;"><img src="{{ 'assets/img/nav-mybag.png'|theme }}" alt=""></a>
							<i class="cartNum">{{shoppingCart.totalQty}}</i>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="d_header-move">
		<div class="fixedTopMune">
			<ul class="fixedUlNav fl flexBox">

				<li class="fl" dataShow="new"><a href="/daily-new.html?rel=home">新入荷</a></li>
				<li class="fl" dataShow="item"><a href="/sale.html?rel=home">売れ筋商品</a></li>

				<li class="fl" datashow="item0"><a href="/dress-c-4664.html">ワンピース</a></li>
				<li class="fl" datashow="item1"><a href="/tops-c-4671.html">トップス</a></li>
				<li class="fl" datashow="item2"><a href="/bottoms-c-4679.html">ボトムス</a></li>
				<li class="fl" datashow="item3"><a href="/outerwear-c-4686.html">アウター</a></li>
				<li class="fl" datashow="item4"><a href="/goods-c-4693.html">雑貨・小物</a></li>
				<li class="fl" datashow="item5"><a href="/shoes-c-4711.html">シューズ</a></li>
				<li class="fl" dataShow="search"><a href=""><i class="fa fa-search" aria-hidden="true"></i>&nbsp;検索</a></li>
				<li class="fl">
					<a class="fl" href="/account/wishlist.html">お気に入り</a>
				</li>
				<li class="fl"><a href="javascript:;" data-request="onLogout" data-request-data="redirect: '/'"><img src="{{ 'assets/img/icon-unlock-move.png'|theme }}" alt=""></a></li>
				<li class="fl"><a href="/account/login.html"><img src="{{ 'assets/img/icon-user-move.png'|theme }}" alt=""></a></li>
				<li class="fl navMybag">
					<a href="javascript:;"><img src="{{ 'assets/img/icon-bag-move.png'|theme }}" alt="" width="28"></a>
					<i class="cartNum">{{shoppingCart.totalQty}}</i>
				</li>
			</ul>
		</div>
	</div>
	<div class="childNavBox" id="new">
		<div class="container">
			<div class="row">
			</div>
		</div>
	</div>
	<div class="childNavBox" id="item">
		<div class="container">
			<div class="row">

			</div>
		</div>
	</div>

	{% for rootcategory in categories %}
	{% for key, category in rootcategory.children %}
	{% if category.is_enabled and category.children %}
	<div class="childNavBox" id="item{{key}}">
		<div class="container">
			<div class="row">
				<div class="col-lg-3">
					<ul class="childNav">
						<li>
							<h3><a href="{{ cate.url}}">{{ cate.name }}</a></h3>
						</li>
						{% for cat in category.children %}
						{% if cat.is_enabled %}
						<li>
							<a href="{{ cat.url }}">{{cat.name}}</a>
						</li>
						{% endif %}
						{% endfor %}
					</ul>
				</div>

			</div>
		</div>
	</div>
	{% endif %}
	{% endfor %}
	{% endfor %}

	<div class="childNavBox" id="search">
		<div class="container">
			<div class="row">
				<div class="col-lg-12">
					<h3 class="searHead"><img src="{{ 'assets/img/ttl-search.png'|theme }}" alt=""></h3>
					<div class="searCont">
						<form action="/search-bootstrap" method="get">
							<i class="fa fa-search" aria-hidden="true"></i>
							<input type="text" placeholder="商品名・品番・キーワードで探す" id="searchIpt" maxlength="100" autocomplete="off" name="q">
							<input type="submit" id="searchBtn" value="検索">
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="indexCartBox hide">
		{% partial 'common/shopping-cart' %}
	</div>
	
	<p style="text-align: center;font-size: 16px;padding: 8px 0;color: #ef98a8;"><i style="font-size: 18px;" class="fa fa-volume-down"></i>&nbsp;&nbsp;後ほど、配達のお知らせメールが届くの為、必ず電話やメールアドレスを正確に記入してください。</p>
</header>

{% for item in catalog.fetchAd('pc-top-banner').items %}
<div class="topADD"><a href="{{ item.link }}" style="display: block;width: 100%;height: 40px;background: url({{item.image.getPath() }}) right no-repeat;"><span class="header-bannertext"></span></a></div>
{% endfor %}
{% for key,item in bannerHeader.items %}
<div id="bannerHeader_fromDate" style="display: none">{{ bannerHeader.from_date }}</div>
<div id="bannerHeader_toDate" style="display: none">{{ bannerHeader.to_date }}</div>
<div id="bannerHeader_now" style="display: none">{{ nowDate }}</div>
{% endfor %}


{% put scripts %}
<script type="text/javascript">
function buquan(num,length){
    var numstr = num.toString();
    var l=numstr.length;
    if (numstr.length>=length) {return numstr;}
      
    for(var  i = 0 ;i<length - l;i++){
      numstr = "0" + numstr;  
     }
    return numstr; 
}
    $(function(){
        clearInterval(timer);
        $("#bannerHeader_fromDate").hide();
        $("#bannerHeader_toDate").hide();
        $("#bannerHeader_now").hide();
        var endtime = $("#bannerHeader_toDate").eq(0).text().replace(/-/g, "/");
        endtime = new Date(endtime).getTime();
		var d=0;
		var h=0;
		var m=0;
		var s=0;
		function GetRTime(){
	        nowtime = new Date().getTime();
	        var chastart = endtime-nowtime;
	        t = chastart;
		    if(t>=0){
		      	d=Math.floor(t/1000/60/60/24);
		      	h=Math.floor(t/1000/60/60%24);
		      	m=Math.floor(t/1000/60%60);
		      	s=Math.floor(t/1000%60);
				/*ms=Math.floor(t%100)*/
				if(d<10 && d>=0) d=buquan(d,2);
				if(h<10 && h>=0) h=buquan(h,2);
				if(m<10 && m>=0) m=buquan(m,2);
				if(s<10 && s>=0) s=buquan(s,2);
				$('.header-bannertext').html("<ul><li><span>" + d + "</span></li>" + "<li><span>" + h + "</span></li>" + "<li><span>" + m + "</span></li>" + "<li><span>" + s + "</span></li>"+"</ul>");
		    } else {
				d=0;
				h=0;
				m=0;
				s=0;
				$('.header-bannertext').html("<ul><li><span>" + d + "</span></li>" + "<li><span>" + h + "</span></li>" + "<li><span>" + m + "</span></li>" + "<li><span>" + s + "</span></li>"+"</ul>");
        		clearInterval(timer);
			}
		}
		GetRTime();
  		var timer = setInterval(GetRTime,500);
    })
</script>
{% endput %}